<template>
  <el-row type="flex" justify="center">
    <el-col :span="20">
      <el-form class="my-el-form" ref="form" :model="form" label-width="80px" size="small">
        <el-divider content-position="left">服务基本信息</el-divider>
        <el-form-item label="服务名称">
          <span>{{errorData.serviceName}}</span>
        </el-form-item>
        <el-form-item label="服务类型">
          <span>{{errorData.serviceType}}</span>
        </el-form-item>
        <el-form-item label="服务状态">
          <span>{{errorData.serviceStatus}}</span>
        </el-form-item>
        <el-form-item label="所属部门">
          <span>{{errorData.serviceDepartment}}</span>
        </el-form-item>
        <el-form-item label="所属专题">
          <span>{{errorData.serviceTopics}}</span>
        </el-form-item>
        <el-divider content-position="left">纠错信息</el-divider>
        <el-form-item label="错误描述">
          <span>{{errorData.plottText}}</span>
        </el-form-item>
        <el-form-item label="错误信息">
          <div id="cesiumDiv" style="
              height: 300px;
              width: 100%;
            "></div>
        </el-form-item>
   <!--     <el-form-item label="图片信息">
          <el-image
              style="width: 100px; height: 100px"
              :src="form.value1"
              :preview-src-list="form.valueList">
          </el-image>
        </el-form-item> -->
        <el-divider content-position="left">纠错人基本信息</el-divider>
        <el-form-item label="联系人">
          <span>{{errorData.corrector}}</span>
        </el-form-item>
        <el-form-item label="联系单位">
          <span>{{errorData.unit}}</span>
        </el-form-item>
        <el-form-item label="联系地址">
          <span>{{errorData.address}}</span>
        </el-form-item>
        <el-form-item label="联系电话">
          <span>{{errorData.phone}}</span>
        </el-form-item>
        <el-form-item label="电子邮箱">
          <span>{{errorData.email}}</span>
        </el-form-item>
        <el-divider></el-divider>
        <el-form-item>
          <!-- <el-button type="primary">回复</el-button>
		 <el-button type="primary">完成</el-button> -->
          <el-button @click="$router.go(-1)">取消</el-button>
        </el-form-item>
      </el-form>
    </el-col>
  </el-row>
</template>

<script>
/**
 *{ 纠错记录详情 }
 * @param:
 * @author: 宋康
 * @DateTime: 2022/7/9
 */
import $axios from "@/network"

var viewer;
export default {
	
  name: "ErrorDetailed",
  data() {
    return {
      form: {
        value1: 'https://app.tianditu.gov.cn/appImage/616297718e0577225a4625f02d6cf7c5/20180503090551/thumb/8689695i.png',
        valueList: ['https://app.tianditu.gov.cn/appImage/616297718e0577225a4625f02d6cf7c5/20180503090551/thumb/8689695i.png']
      },
	  id: 0,
	  errorData: [],
    }
  },
  mounted() {
    this.webGlobe();
	  this.getErrorAll();
  	this.id = this.$route.query.id;
  },
  methods: {
	  getErrorAll(){

		  $axios({
			  url: "/online/errorCorrection/getErrorCorrectionAll",
		  }).then(res => {

			  for(let i=0; i<res.data.length;i++){
				  console.log(this.id)
				  console.log(res.data[i].id)
				  if(this.id == res.data[i].id){
					  this.errorData = res.data[i];
					  console.log(this.errorData);
            let plott = [];
            plott = res.data[i].plott.split(',');


            viewer.camera.setView({
              destination: Cesium.Cartesian3.fromDegrees(parseFloat(plott[0]), parseFloat(plott[1]), 10000)
            });

            viewer.entities.add({
              position: Cesium.Cartesian3.fromDegrees(parseFloat(plott[0]), parseFloat(plott[1]), 10),
              billboard: {
                image: require("./img/dot.png"),
                width: 50,
                height: 50
              }
            });
            console.log(plott);
				  }
			  }
		  })
	  },
    webGlobe() {
      //加载地图
      viewer = new Cesium.Viewer("cesiumDiv", {
        animation: false,
        baseLayerPicker: false,
        fullscreenButton: false,
        geocoder: false,
        homeButton: false,
        infoBox: false,
        sceneModePicker: false,
        selectionIndicator: false,
        timeline: false,
        navigationHelpButton: false,
        sceneMode: 1, //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneMode //2D 3D转换
        skyBox: new Cesium.SkyBox({
          // 自定义天空盒
          sources: {
            positiveX: "./Cesium/skybox/starmap_2020_16k_px.jpg",
            negativeX: "./Cesium/skybox/starmap_2020_16k_mx.jpg",
            positiveY: "./Cesium/skybox/starmap_2020_16k_py.jpg",
            negativeY: "./Cesium/skybox/starmap_2020_16k_my.jpg",
            positiveZ: "./Cesium/skybox/starmap_2020_16k_pz.jpg",
            negativeZ: "./Cesium/skybox/starmap_2020_16k_mz.jpg",
          },
        }),
      });

      // 文字无遮挡
      viewer.cesiumWidget.creditContainer.style.display = "none";
      //实体不遮挡
      viewer.scene.globe.depthTestAgainstTerrain = false;
      //相机的高度的最小值
      viewer.scene.screenSpaceCameraController.minimumZoomDistance = 800;
      viewer.scene.screenSpaceCameraController.maximumZoomDistance = 60000;

      let evLayerManager = new Cesium.EV_LayerManager(viewer.scene);

      let vec_cache = evLayerManager.add({
        name: 'vec_cache',
        url: 'http://10.255.126.154:8088',
        type: Cesium.EV_LayerType.IMAGE,
      });

    }
  },
}
</script>

<style lang="scss" scoped>
.my-el-form {
  &::v-deep .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
    margin-bottom: 0;
  }
}
</style>